<template>
  <!-- 账户明细 -->
  <el-dialog
    title="账户明细"
    :visible.sync="show"
    width="1000px"
    append-to-body
    :close-on-click-modal="false"
    @close="handleClose"
  >
    <YxhyTableData :max-height="400" :columns="columnsAccountDetail" :data="tableList" :loading="loading" />

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryPage.pageNum"
      :limit.sync="queryPage.limit"
      @pagination="init()"
    />

    <div slot="footer" class="dialog-footer">
      <el-button @click="handleClose">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { columnsAccountDetail } from '@/views/user/userData/Ds'
import { queryPlatformAccountList } from '@/api/user/userData'

export default {
  name: 'AccountDetail',
  props: {
    user_id: {
      type: [Number, String]
    }
  },
  data() {
    return {
      show: false,
      // 总条数
      total: 0,
      // 表格数据
      tableList: [],
      // 分页参数
      queryPage: {
        pageNum: 1,
        limit: 10
      },
      loading: false,
      // 表格列
      columnsAccountDetail
    }
  },
  methods: {
    handleOpen() {
      this.show = true
      this.init()
    },
    handleClose() {
      this.show = false
    },
    async init() {
      const res = await queryPlatformAccountList({
        ...this.queryPage,
        user_id: this.$props.user_id
      })
      this.tableList = res.data
      this.total = res.total
      this.loading = false
    }
  }
}
</script>

<style scoped>

</style>
